<template>
	<view class="container" :class="'theme-'+theme">
		<view class="nav">
			<image @click="clickBack()" class="back" src="../../static/nav-back.png" />
			<view class="title">选择售后类型</view>
			<!--			<view class="submit" v-if="status===1" @click="submit">提交</view> {{supplierType}}{{supplierType==='emall'?'（电商）':'（供应商）'}}-->
		</view>
		<view class="product-area">
			<view class="title">售后商品</view>
			<view class="product">
				<view class="left">
					<image :src="productData.thumbnail" />
				</view>
				<view class="right">
					<text class="name more-t">{{productData.productName}}</text>
					<view class="bottom">
						<text>单价: {{productData.salePrice|twoBitMoney}} </text>
						<text>购买数量: {{productData.num}}</text>
					</view>
				</view>

			</view>
			<view class="info-area" v-if="status===1">
				<view class="info-item">
					<view v-if="returnType!=4 && returnType!=3">
						<view class="left">{{returnType===1?'退':'换'}}货数量</view>
						<view style="font-size: 12px;color: #999;line-height: 20px">
							最多可{{returnType===1?'退':'换'}}{{maxNum}}件
						</view>
					</view>
          <view v-else-if="returnType==3">
            <view class="left">维修数量</view>
            <view style="font-size: 12px;color: #999;line-height: 20px">
              最多可退{{maxNum}}件
            </view>
          </view>
					<view v-else>
						<view class="left">退款数量</view>
						<view style="font-size: 12px;color: #999;line-height: 20px">
							最多可退{{maxNum}}件
						</view>
					</view>
					<view class="right">
						<view class="uni-num-box">
							<view class="subtract"
								style="border-top-left-radius: 10rpx;border-bottom-left-radius: 10rpx;"
								:class="{disabled:num===1||num==='1'}" @click="editNum(0)">-</view>
							<input :adjust-position="true" class="count" type="number" v-model:value="num"
								@blur="editInputNum" @confirm="editInputNum" />
							<view class="add" style="border-top-right-radius: 10rpx;border-bottom-right-radius: 10rpx;"
								@click="editNum(1)" :class="{disabled:num===maxNum}">+</view>
						</view>
					</view>
				</view>
			</view>

		</view>
		<!--  选择售后类型  -->
		<view class="type-area soild" v-if="status===0">
			<view class="title">选择售后类型</view>
			<view class="type-item" @click="chooseType(4)" v-if="orderData.status!='completed' && canOnlyRefund && saleAfterSupportInfo['4'].support">
					<view class="left">
						<image class="icon" src="../../static/return.png" />
						<text>仅退款</text>
						<text style="font-size: 13px;color: #999;font-weight: normal;">仅退款</text>
					</view>
					<view class="right">
						<text class="yticon icon-you"></text>
					</view>
			</view>
			<view v-if="canSaleAfterNum>0 && saleAfterSupportInfo['1'].support && orderData.status=='completed'" class="type-item" @click="chooseType(1)">
				<view class="left">
					<image class="icon" src="../../static/return.png" />
					<text>退款退货</text>
					<text style="font-size: 13px;color: #999;font-weight: normal;">退回收到的商品</text>
				</view>
				<view class="right">
					<text class="yticon icon-you"></text>
				</view>
			</view>
			<view v-if="canSaleAfterNum>0 && saleAfterSupportInfo['2'].support && orderData.status=='completed'" class="type-item" @click="chooseType(2)">
				<view class="left">
					<image style="transform: scale(1.1);" class="icon" src="../../static/change.png" />
					<text>换货</text>
					<text style="font-size: 13px;color: #999;font-weight: normal;">联系供应商协商换货</text>
				</view>
				<view class="right">
					<text class="yticon icon-you"></text>
				</view>
			</view>
      <view v-if="canSaleAfterNum>0 && saleAfterSupportInfo['3'].support && (orderData.supplierType=='protocol'||orderData.supplierType=='supplier') && orderData.status=='completed' && !(orderData.orderType == 'bidding' || orderData.orderType == 'inquiry')" class="type-item" @click="chooseType(3)">
<!--      <view v-if="canSaleAfterNum>0 && saleAfterSupportInfo['3'].support" class="type-item" @click="chooseType(2)">-->
        <view class="left">
          <image style="transform: scale(1.1);" class="icon" src="../../static/change.png" />
          <text>维修</text>
          <text style="font-size: 13px;color: #999;font-weight: normal;">联系供应商维修商品</text>
        </view>
        <view class="right">
          <text class="yticon icon-you"></text>
        </view>
      </view>
		</view>

		<view class="info-area" v-if="status===1 && !maintenanceStatus">
			<view class="title" v-if="returnType!=4">{{returnType===1?'退':'换'}}货信息</view>
			<view class="title" v-else>退款信息</view>
			<view class="info-item" v-if="returnType == 4">
				<view class="left">退款金额</view>
				<view class="right">
					¥{{subAmount}}
				</view>
			</view>
			<view class="info-item" @click="toggleMask('show',0)">
				<view class="left" v-if="returnType!=4">{{returnType===1?'退':'换'}}货原因</view>
				<view class="left" v-else>退款原因</view>
				<view class="right">
					<text style="font-size: 14px;color: #999;">{{reason}}</text>
					<text class="yticon icon-you"></text>
				</view>

			</view>
			<view class="exp2">
				<textarea v-model="msg" placeholder-class="ph" placeholder="请填写说明信息" class="content"></textarea>
			</view>
			<view class="info-item" style="margin-top: -10rpx" @click="toggleMask('show',2)"
				v-if="supplierType==='emall'||supplierType==='eplus'">
				<!--            v-if="!(revertWay==='2'&&returnType===1&&supplierType!='emall')">-->
				<view class="left">是否需要检测报告</view>
				<view class="right">
					<text style="font-size: 14px;color: #999;">{{isCheck==='1'?'需要':'不需要'}}</text>
					<text class="yticon icon-you"></text>
				</view>
			</view>
			<view class="info-item" @click="toggleMask('show',3)"
				v-if="supplierType==='emall'||supplierType==='eplus'">
				<view class="left">是否有包装</view>
				<view class="right">
					<text style="font-size: 14px;color: #999;">{{isPack ==='1'?'有':'没有'}}</text>
					<text class="yticon icon-you"></text>
				</view>
			</view>
			<view class="info-item" @click="toggleMask('show',4)"
				v-if="supplierType==='emall'||supplierType==='eplus'">
				<view class="left">是否包装完整</view>
				<view class="right">
					<!--      0 无包装 10 包装完整 20 包装破损    -->
					<text
						style="font-size: 14px;color: #999;">{{baoway==='0'?'无包装':baoway==='10'?'包装完整':baoway==='20'?'包装破损':'未知'}}</text>
					<text class="yticon icon-you"></text>
				</view>
			</view>
			<template v-if="returnType!=4">
				<view class="info-item" @click="toggleMask('show',1)">
					<view class="left">{{returnType===1?'退':'换'}}货方式</view>
					<view class="right">
						<text style="font-size: 14px;color: #999;">{{revertWay==='1'?'供应商上门取件':'物流发货'}}</text>
						<text class="yticon icon-you"></text>
					</view>
				</view>
				<view v-if="revertWay==='1'">
					<view class="info-item" @click="navTo('/pages/address/address?source=2')">
						<view class="left">联系方式</view>
						<view class="right">
							<text style="font-size: 14px;color: #999;">{{addressData.consigneeName}}
								{{addressData.mobile}}</text>
							<text class="yticon icon-you"></text>
						</view>
					</view>
				</view>
			</template>
		</view>
    <view class="info-area" v-if="status===1 && maintenanceStatus">
      <view class="title">维修信息</view>
      <view class="info-item" v-if="returnType == 4">
        <view class="left">退款金额</view>
        <view class="right">
          ¥{{subAmount}}
        </view>
      </view>
      <view class="exp2">
        <view class="info-item" style="height: 40upx;margin-bottom: 20upx;">
          <view class="left">说明</view>
        </view>
        <textarea v-model="msg" placeholder-class="ph" placeholder="请填写说明信息" class="content"></textarea>
      </view>
      <view class="info-item" style="margin-top: -10rpx" @click="toggleMask('show',2)"
            v-if="supplierType==='emall'||supplierType==='eplus'">
        <!--            v-if="!(revertWay==='2'&&returnType===1&&supplierType!='emall')">-->
        <view class="left">是否需要检测报告</view>
        <view class="right">
          <text style="font-size: 14px;color: #999;">{{isCheck==='1'?'需要':'不需要'}}</text>
          <text class="yticon icon-you"></text>
        </view>
      </view>
      <view class="info-item" @click="toggleMask('show',3)"
            v-if="supplierType==='emall'||supplierType==='eplus'">
        <view class="left">是否有包装</view>
        <view class="right">
          <text style="font-size: 14px;color: #999;">{{isPack ==='1'?'有':'没有'}}</text>
          <text class="yticon icon-you"></text>
        </view>
      </view>
      <view class="info-item" @click="toggleMask('show',4)"
            v-if="supplierType==='emall'||supplierType==='eplus'">
        <view class="left">是否包装完整</view>
        <view class="right">
          <!--      0 无包装 10 包装完整 20 包装破损    -->
          <text
              style="font-size: 14px;color: #999;">{{baoway==='0'?'无包装':baoway==='10'?'包装完整':baoway==='20'?'包装破损':'未知'}}</text>
          <text class="yticon icon-you"></text>
        </view>
      </view>
      <template v-if="returnType==3">
        <view class="info-item" @click="toggleMask('show',1)">
          <view class="left">维修方式</view>
          <view class="right">
            <text style="font-size: 14px;color: #999;">{{revertWay==='1'?'供应商上门取件':'物流发货'}}</text>
            <text class="yticon icon-you"></text>
          </view>
        </view>
        <view v-if="revertWay==='1'">
          <view class="info-item" @click="navTo('/pages/address/address?source=2')">
            <view class="left">联系方式</view>
            <view class="right">
              <text style="font-size: 14px;color: #999;">{{addressData.consigneeName}}
                {{addressData.mobile}}</text>
              <text class="yticon icon-you"></text>
            </view>
          </view>
        </view>
      </template>
    </view>
		<!--		<view class="exp" v-if="returnType===1&&revertWay===2&&status===1">-->
		<view class="exp" v-if="(revertWay==='1'&&returnType === 2&&status===1)||(revertWay==='1'&&returnType === 1&&status===1) || (revertWay==='1'&&returnType === 3&&status===1)">
			<view class="soild" style="display: flex">
				<view class="title">{{(returnType === 2 && revertWay === '2')?'收货':'取件'}}地址</view>
				<text
					style="font-size: 12px;color: #999;line-height: 20px;margin-left: 5px">(该地址是供应商{{(returnType === 2 && revertWay === '2')?'收货':''}}上门取旧商品的地址)</text>
			</view>
			<!--      <view class="cgr-info" @click="navTo('/pages/address/address?source=2')">-->
			<view class="cgr-info" @click="toggleTab">
				<!-- <u-icon name="map"></u-icon> -->
				<view class="lefts" style="">
					<view style="">
						<text class="eticon eticon-dingwei themeTextColor" style="margin-left: 10rpx;"></text>
					</view>
				</view>
				<view class="right" style="margin-left: -60px">
					<view>
						<view style="float: left;width: 210px">
							<text>{{addressData.consigneeName}}</text>
							<text class="tel">{{addressData.mobile}}</text>
							<view class="address">
								<text>{{addressData.areaName+' '+addressData.addr}}</text>
							</view>
						</view>
					</view>

				</view>
				<view class="right">
					<text class="yticon icon-you" style="margin-right: 2px"></text>
				</view>
			</view>

			<!--			<textarea v-model="exp" placeholder-class="ph" placeholder="请填写说明信息" class="content"></textarea>-->
		</view>


		<!-- 配送至 -->
		<!--    <view class="c-list" v-if="type==='3'?true:false">-->
		<!--      <view class="c-row b-b" style="justify-content: space-between;" @click="toggleTab">-->
		<!--        <text class="tits-ps">选择其他地区</text>-->
		<!--        <text class="yticon icon-you"></text>-->
		<!--      </view>-->
		<!-- 选择收货地址 -->
		<uni-popup ref="popup" type="bottom">
			<view class="popup">
				<view class="picker-btn">
					<view class="lefts" @click="cancel">取消</view>
					<view class="rights" @click="confirm">确定</view>
				</view>
				<view class="s-list b-b" v-for="(item, index) in addrData.records" :key="index"
					@click="checkAddress(item)">
					<view class="wrapper">
						<view class="address-box" :class="{'active': selectIndex == item.id }">
							<text v-if="item.isDefault" class="tag themeBorderColor themeTextColor">默认</text>
							<view class="address">{{item.areaName}} {{item.addr}}</view>
						</view>
						<!-- 	<view class="u-box">
                <text class="name">{{item.consigneeName}}</text>
                <text class="mobile">{{item.mobile}}</text>
              </view> -->
					</view>
					<!-- <text class="yticon icon-bianji" @click.stop="addAddress('edit', item)"></text> -->
					<!-- <image class="delete" mode="aspectFill" src="../../static/delete.png" @click.stop="delAddr(item)"></image> -->
				</view>
			</view>

		</uni-popup>

		<!--      <view class="s-list b-b" v-for="(item, index) in addrData.records" :key="index"-->
		<!--            @click="checkAddress(item)">-->
		<!--        <view class="wrapper">-->
		<!--          <view class="address-box" :class="{'active': selectIndex == item.id }">-->
		<!--            <text v-if="item.isDefault" class="tag">默认</text>-->
		<!--            <view class="address">{{item.areaName}} {{item.addr}}</view>-->
		<!--          </view>-->
		<!--          &lt;!&ndash; 	<view class="u-box">-->
		<!--            <text class="name">{{item.consigneeName}}</text>-->
		<!--            <text class="mobile">{{item.mobile}}</text>-->
		<!--          </view> &ndash;&gt;-->
		<!--        </view>-->
		<!--        &lt;!&ndash; <text class="yticon icon-bianji" @click.stop="addAddress('edit', item)"></text> &ndash;&gt;-->
		<!--        &lt;!&ndash; <image class="delete" mode="aspectFill" src="../../static/delete.png" @click.stop="delAddr(item)"></image> &ndash;&gt;-->
		<!--      </view>-->
		<!--    </view>-->

		<!-- 		<view class="footer" v-if="status===1">
			<view class="confirm" @click="submit">提交</view>
		</view> -->

		<!-- 选择面板 -->
		<view class="mask" :class="maskState===0 ? 'none' : maskState===1 ? 'show' : ''" @click="toggleMask">
			<view class="mask-content" @click.stop.prevent="stopPrevent">
				<view class="header">
					<view class="title" v-if="maskType===0 ||maskType===1">
						{{returnType===1?'退':'换'}}货{{maskType===0?'原因':'方式'}}</view>
					<view class="title" v-if="maskType===2">是否需要检测报告</view>
					<view class="title" v-if="maskType===3">是否有包装</view>
					<view class="title" v-if="maskType===4">是否包装完整</view>
					<image src="../../static/close.png" class="close" @click="toggleMask('close',maskType)" />
				</view>
				<view v-if="maskType===0">
					<radio-group @change="radioChange($event,0)">
						<view style="font-size: 15px;padding: 10rpx;" v-for="(item,index) in dictData.RETURN_REASON" :key="index">
							<radio style="transform: scale(0.7);" :value="item.code" :checked="index===reasonIndex">
							</radio>
							{{item.name}}
						</view>
					</radio-group>
				</view>
				<view v-if="maskType===1">
					<radio-group @change="radioChange($event,1)">
						<view style="font-size: 14px;padding: 10rpx;" v-for="(item,index) in revertWayList" :key="index">
							<radio style="transform: scale(0.7);" :value="item.code" :checked="index===wayIndex">
							</radio>
							{{item.name}}
						</view>
					</radio-group>
				</view>
				<view v-if="maskType===2">
					<radio-group @change="radioChange($event,2)">
						<view style="font-size: 14px;padding: 10rpx;" v-for="(item,index) in isCheckList" :key="index">
							<radio style="transform: scale(0.7);" :value="item.code" :checked="index===checkIndex">
							</radio>
							{{item.name}}
						</view>
					</radio-group>
				</view>
				<view v-if="maskType===3">
					<radio-group @change="radioChange($event,3)">
						<view style="font-size: 14px;padding: 10rpx;" v-for="(item,index) in isPackList" :key="index">
							<radio style="transform: scale(0.7);" :value="item.code" :checked="index===packIndex">
							</radio>
							{{item.name}}
						</view>
					</radio-group>
				</view>
				<view v-if="maskType===4">
					<radio-group @change="radioChange($event,4)">
						<view style="font-size: 14px;padding: 10rpx;" v-for="(item,index) in baozhuanglist" :key="index">
							<radio style="transform: scale(0.7);" :value="item.code" :checked="index===baozhuangIndex">
							</radio>
							{{item.name}}
						</view>
					</radio-group>
				</view>
				<!-- 				<view class="footer">
					<view class="confirm" @click="confirm">确定</view>
				</view> -->
			</view>

		</view>
		<view v-if="status===1">
			<u-button class="action-button themeBgColor" @click="submit">提交</u-button>
		</view>
		<!--    <view v-if="status===1&&returnType===2">-->
		<!--      <u-button class="action-button" @click="submit">提交1</u-button>-->
		<!--    </view>-->
		<!-- 选择面板 -->
		<!--    <view class="mask" :class="maskState===0 ? 'none' : maskState===1 ? 'show' : ''" @click="toggleMask">-->
		<!--      <view class="mask-content" @click.stop.prevent="stopPrevent">-->
		<!--        <view class="header">-->
		<!--          <view class="title">{{returnType===1?'退':'换'}}货{{maskType===0?'原因':'方式'}}</view>-->
		<!--          <image src="../../static/close.png" class="close" @click="toggleMask('close',maskType)" />-->
		<!--        </view>-->

		<!--        <view v-if="maskType===2">-->
		<!--          <radio-group @change="radioChange($event,1)">-->
		<!--            <view style="font-size: 14px;padding: 10rpx;" v-for="(item,index) in revertWayList">-->
		<!--              <radio style="transform: scale(0.7);" :value="item.code" :checked="index===wayIndex"></radio>-->
		<!--              {{item.name}}-->
		<!--            </view>-->
		<!--          </radio-group>-->
		<!--        </view>-->
		<!--        &lt;!&ndash; 				<view class="footer">-->
		<!--          <view class="confirm" @click="confirm">确定</view>-->
		<!--        </view> &ndash;&gt;-->
		<!--      </view>-->
		<!--    </view>-->

	</view>
</template>

<script>
	import {
		getOrdersItemBySn,
		submitAftersale
	} from '../../api/aftersale/aftersale.js'
	import {
		getDict,
		getAddressList,
		loadAddr,
		loadChildAddr
	} from '../../api/order/order.js'
	import UButton from "../../uview-ui/components/u-button/u-button";
	export default {
		components: {
			UButton
		},
		data() {
			return {
				province: [],
				indicatorStyle: `height: ${Math.round(uni.getSystemInfoSync().screenWidth/(750/100))}px;`,
				valueArr: [0, 0, 0, 0], //用于判断当前滑动的那一列
				selectaddressData: {
					consigneeName: '',
					mobile: '',
					areaId: '',
					areaName: '',
					addr: '',
					isDefault: false,
					email: ''
				},
				orderInfo: {
					consigneeName: '洋洋',
					ext: {},
					items: {},
					master: {},
					area: '北京'
				},
				type: 1,
				orderSn: '',
				productId: '',
				deptName: '',
				orderData: {},
				status: 0,
        maintenanceStatus: false,
				productData: {},
				supplierType: '', // 电商 "emall"  本地供应商 "protocol"
				returnType: 0, // 1 退货 2 换货 3 维修
				num: 1,
				revertWay: '1', // 1 供应商上门取件 2 物流发货
				tuihuoway:'1',
				tuihuo:0,
				baozhuangIndex:0,
				baoway:'0',
				wayIndex: 0,
				isCheck: '0', // 是否需要检测报告 0：不需要 1：需要
				checkIndex: 0,
				isPack: '0', // 是否有包装 0：没有 1有
				packIndex: 0,
				isComplete: '0', // 包装描述：0 无包装 10 包装完整 20 包装破损
				completeIndex: 0,
				exp: '',
				maxNum: 999,
				dictData: {
					SALEAFTER_RETURN_MONEY_REASON:[]
				},
				maskState: 0, // 0 不显示 1 显示
				maskType: 0, // 0 退货原因选择面板 1 退货方式选择面板
				reason: '', // 原因内容
				msg: '', // 原因描述
				placeholder: '请填写说明信息\n', //说明信息
				reasonCode: '', // 原因编码
				reasonIndex: 0,
				tuihuolist:[
					{
						code: '1',
						name: '供应商上门取件'
					},
					{
						code: '2',
						name: '物流发货'
					}
				],
				revertWayList: [{
						code: '1',
						name: '供应商上门取件'
					},
					{
						code: '2',
						name: '物流发货'
					}
				],
				baozhuanglist:[
					{
						code: '0',
						name: '无包装'
					},
					{
						code: '10',
						name: '包装完整'
					},
					{
						code: '20',
						name: '包装破损'
					}
				],
				isCheckList: [{
						code: '0',
						name: '不需要'
					},
					{
						code: '1',
						name: '需要'
					}
				],
				isPackList: [{
						code: '0',
						name: '没有'
					},
					{
						code: '1',
						name: '有'
					}
				],
				isCompleteList: [{
						code: '0',
						name: '无包装'
					},
					{
						code: '10',
						name: '包装完整'
					},
					{
						code: '20',
						name: '包装破损'
					}
				],
				addressData: {},
				userInfo: {},
				addrData: {},
				selectIndex: '',
        saleAfterSupportInfo: {
          '1': { support: false, prompt: '', tipConfType: '23' },
          '2': { support: false, prompt: '', tipConfType: '26' },
          '3': { support: false, prompt: '', tipConfType: '24' },
          '4': { support: false, prompt: '', tipConfType: '25' },
        },
			};
		},
		onLoad(option) {
			this.type = option.type
			this.orderSn = option.sn
			this.productId = option.id
			this.deptName = option.deptName
			this.userInfo = uni.getStorageSync('userInfo')
			this.loadAddrList()
			this.getDictData()
			this.loadData()
		},
		computed:{
			subAmount(){
				return (Number(this.num) * this.productData.price||0).toFixed(2)
			},
			onlyFundNum(){
				// 仅退款数量                    未发货数量                       -         未发货已售后数量
				const num = (this.productData.num-this.productData.shippedNum) - this.productData.unDeliverSaleAfterNum
				return num<0?0:num
			},
			canOnlyRefund(){
				return this.onlyFundNum>0
			},
			canSaleAfterNum(){
				// const num = this.productData.receiveNum - this.productData.receiveSaleafterNum - this.productData.confirmedUnReceiveSaleAfterNum
				const num = this.productData.num - this.productData.returnNum
				return num<0?0:num
			}
		},
		onShow() {
			// this.type = option.type
			// this.orderSn = option.sn
			// this.productId = option.id
			// this.deptName = option.deptName
			// this.userInfo = uni.getStorageSync('userInfo')
			// this.loadAddrList()
			// this.getDictData()
			// this.loadData()
		},
		methods: {
			//加载收货地址列表
			loadAddrList() {
				const params = {
					page: 1,
					limit: 10
				}
				getAddressList(params).then(res => {
					console.log('data=========================', res)
					if (res.code === 0) {
						if (res.data !== null) {
							this.addrData = res.data
							console.log('addrData1', this.addrData)
							this.addressData = res.data.records[0];
						}
					} else {
						this.toast(res.message)
					}
				})
			},
			getDictData() {
				const params = {
					data: '["RETURN_REASON", "SALE_AFTER_NEED_REPORT", "SALE_AFTER_HAS_PACKAGE", "SALE_AFTER_PACKAGE_DESC", "SALEAFTER_RETURN_MONEY_REASON"]'
				}
				getDict(params).then(res => {
					if (res.code === 0) {
						this.dictData = res.data
						this.reason = this.dictData.RETURN_REASON[0].name
						this.reasonCode = this.dictData.RETURN_REASON[0].code
					} else {
						this.$util.msg(res.message)
					}
				})
			},
			loadData() {
				const params = {
					orderSn: this.orderSn,
					type: this.type,
					orderItemId: this.productId
				}
				getOrdersItemBySn(params).then(res => {
					if (res.code === 0) {
						this.orderData = res.data
						this.productData = res.data.items[0]
            // if (){
            //
            // }
						this.maxNum = this.productData.receiveNum - this.productData.receiveSaleafterNum - this.productData.confirmedUnReceiveSaleAfterNum
						this.num = this.maxNum
						this.supplierType = this.orderData.supplierType
						if (this.orderData.isSupplierSplit) {

						} else {

						}
            let items = this.orderData.items;
            for (let item of items) {
              // { code: "1", name: "退货退款" },
              // { code: "2", name: "换货" },
              // { code: "3", name: "维修" },
              // { code: "4", name: "退款" },
              this.saleAfterSupportInfo = {}
              for (let i = 0; i < item.saleAfterSupportInfo.length; i++) {
                this.saleAfterSupportInfo[item.saleAfterSupportInfo[i].saleAfterType] = item.saleAfterSupportInfo[i]
              }
            }
            console.log('this.saleAfterSupportInfo',this.saleAfterSupportInfo)
					} else {
						this.$util.msg(res.message)
					}
				})
			},
			back() {
                // #ifdef H5
                let canBack = true
                const pages = getCurrentPages()
                // 有可返回的页面则直接返回，uni.navigateBack默认返回失败之后会自动刷新页面 ，无法继续返回
                if (pages.length > 1) {
                    uni.navigateBack(1)
                    return;
                }
                // vue router 可以返回uni.navigateBack失败的页面 但是会重新加载
                let a = this.$router.go(-1)
                // router.go失败之后则重定向到首页
                if (a == undefined) {
                    uni.reLaunch({
                        url: "/pages/index/index"
                    })
                }
                return;
                // #endif
                uni.navigateBack(1)
            },
			clickBack() {
				switch (this.status) {
					case 0:
						uni.navigateBack()
						break;
					case 1:
						this.status = 0
						this.num = 1
						this.revertWay = '1'
						this.wayIndex = 0
						this.isCheck='0' // 是否需要检测报告 0：不需要 1：需要
						this.checkIndex=0
						this.isPack='0' // 是否有包装 0：没有 1有
						this.packIndex=0
						this.baoway='0' // 包装描述：0 无包装 10 包装完整 20 包装破损
						this.baozhuangIndex=0
						this.maskType=0 // 0 退货原因选择面板 1 退货方式选择面板
						this.exp = ''
						this.reason = this.dictData.RETURN_REASON[0].name
						this.reasonCode = this.dictData.RETURN_REASON[0].code
						this.reasonIndex = 0
						this.addressData = this.addrData.records[0]
						break;
				}
			},
			navTo(url) {
				uni.navigateTo({
					url
				})
			},
			chooseType(type) {
				this.returnType = type;
				this.status += 1;
				this.supplierType = this.orderData.supplierType
				if(type===4){
					// 仅退款
          this.maintenanceStatus = false
					this.reason = this.dictData.SALEAFTER_RETURN_MONEY_REASON[0].name
					this.reasonCode = this.dictData.SALEAFTER_RETURN_MONEY_REASON[0].code
					this.reasonIndex = 0
					this.maxNum = this.onlyFundNum
				}else if (type==3){
				  this.maintenanceStatus = true
          // this.maxNum = this.productData.receiveNum - this.productData.receiveSaleafterNum - this.productData.confirmedUnReceiveSaleAfterNum
          this.maxNum = this.productData.num - this.productData.returnNum
          this.reason = this.dictData.RETURN_REASON[0].name
          this.reasonCode = this.dictData.RETURN_REASON[0].code
        }else{
          this.maintenanceStatus = false
					// this.maxNum = this.productData.receiveNum - this.productData.receiveSaleafterNum - this.productData.confirmedUnReceiveSaleAfterNum
          this.maxNum = this.productData.num - this.productData.returnNum
					this.reason = this.dictData.RETURN_REASON[0].name
					this.reasonCode = this.dictData.RETURN_REASON[0].code
				}
				this.num = this.maxNum
			},
			editNum(type) {
				var num = parseInt(this.num);
				this.num = type === 0 ? (num <= 1 ? this.num : num - 1) : (num + 1 > this.maxNum ? num : num + 1);
			},
			editInputNum(e) {
				var exceptNum = e.detail.value;
				if (!/^\d*[1-9]\d*$/.test(exceptNum)) {
					this.$util.msg('请填写整数！')
					return;
				}
				this.num = parseInt(exceptNum);
			},
			// 弹出框事件
			toshow(value) {

				switch (value) {
					case 'select':
						// this.selectData = []
						this.type = '1';
						console.log('selcetData', this.selectData);
						this.control = true;
						break;
					case 'select2':
						this.type = '3';
						this.control = true;
						break;
					case 'select3':
						this.type = '2';
						this.control = true;

						break;
				}
			},
			// 新增收货地址
			toggleTab() {
				this.$refs.popup.open();
			},
			//选择地址
			checkAddress(item) {
				console.log('选择收货地址', item)
				// this.$emit('selectAddress', item)
				this.selectIndex = item.id
				this.addressData.areaName = item.areaName
				this.addressData.areaId = item.areaId
				this.addressData.addr = item.addr
				this.addressData.consigneeName = item.consigneeName
				this.addressData.mobile = item.mobile
				console.log('选择完成')
			},
			// 选择收货地址
			bindChange(e) {
				var val = e.detail.value;
				console.log('000000000', val[0])
				if (this.valueArr[0] !== val[0]) {
					console.log('地区------------', val)
					console.log('地区------------', this.province)
					console.log('地区编号------------', this.province[val[0]].id)
					let id = this.province[val[0]].id
					console.log(typeof id)
					this.loadCity(id)
				} else if (this.valueArr[1] !== val[1]) {
					this.loadArea(this.province[val[0]].children[val[1]].id, 1)
				} else if (this.valueArr[2] !== val[2]) {
					this.loadArea(this.province[val[0]].children[val[1]].children[val[2]].id, 2)
				}
				this.valueArr = val
			},
			// 取消
			cancel() {
				this.$refs.popup.close();
			},
			// 确定
			confirm() {
				// this.addressData.areaName = this.selectaddressData.areaName
				// this.addressData.areaIds = this.areaIds
				this.$refs.popup.close();
				// let address = {}

				// this.$emit('selectAddress', address)
				// this.close()
			},
			//显示选择面板
			toggleMask(status, type) {
				// console.log(status)
				// console.log(type)
				// if(!status&&!type){
				// 	setTimeout(() => {
				// 		this.maskState = 0;
				// 	}, 300)
				// }
				// if (this.maskState === 1 && status !== 'close')
				// 	return
				let timer = status === 'show' ? 10 : 300;
				let state = status === 'show' ? 1 : 0;
				if (state === 1)
					this.maskType = type
				this.maskState = 2
				setTimeout(() => {
					this.maskState = state;
				}, timer)
			},
			radioChange(e, type) {
				if (type === 0) {
					// 退货原因
					this.dictData.RETURN_REASON.forEach((item, index) => {
						if (item.code === e.target.value) {
							this.reasonIndex = index
							this.reasonCode = item.code
							this.reason = item.name
						}
					})
				} else if (type === 1) {
					console.log('xiugai======');
					// 退货方式
					this.revertWayList.forEach((item, index) => {
						if (item.code === e.target.value) {
							this.wayIndex = index
							this.revertWay = item.code
						}
					})
					// this.tuihuolist.forEach((item, index) => {
					// 	if (item.code === e.target.value) {
					// 		this.tuihuo = index
					// 		this.tuihuoway = item.code
					// 	}
					// })
					console.log('ssss',this.wayIndex);
						console.log('ssss',this.revertWay);
				} else if (type === 2) {
					// 是否需要检测
					this.isCheckList.forEach((item, index) => {
						if (item.code === e.target.value) {
							this.checkIndex = index
							this.isCheck = item.code
						}
					})
				} else if (type === 3) {
					// 是否有包装
					this.isPackList.forEach((item, index) => {
						console.log(item)

						if (item.code === e.target.value) {
							this.packIndex = index
							this.isPack = item.code
							console.log('this.isPack ', this.isPack)
						}
					})
				} else if (type === 4) {
					// 是否包装完整
					// this.isCompleteList.forEach((item, index) => {
					// 	console.log(item)
					// 	console.log('wayIndex',this.wayIndex);
					// 	console.log('ssss',this.revertWay);
					// 	console.log(e.target.value)
					// 	if (item.code === e.target.value) {
					// 		this.completendex = index
					// 		this.isComplete = item.code
					// 		console.log('this.isPack ', this.isComplete)
					// 	}
					// })
					this.baozhuanglist.forEach((item, index) => {
						console.log(item)
						// console.log('wayIndex',this.wayIndex);
						// console.log('ssss',this.revertWay);
						console.log(e.target.value)
						if (item.code === e.target.value) {
							this.baozhuangIndex = index
							this.baoway = item.code
							// console.log('this.isPack ', this.isComplete)
						}
					})
				}
				this.toggleMask('close')
			},
			submit() {
				if(this.returnType != 4){
					const str = this.returnType === 1 ? '退' : '换';
					if (!this.reason) {
						this.$util.msg(`请选择{str}货原因`)
						return;
					}
					if (!this.revertWay) {
						this.$util.msg(`请选择{str}货方式`)
						return;
					}
					if (!this.isCheck) {
						this.$util.msg(`请选择{str}是否需要检测`)
						return;
					}
					if (!this.isPack) {
						this.$util.msg(`请选择{str}是否有包装`)
						return;
					}
					if (!this.isComplete) {
						this.$util.msg(`请选择{str}是否包装完整`)
						return;
					}

					if (!this.addressData) {
						if (!(this.revertWay === '2' && this.returnType === 1)) {
							if (this.returnType === 2 && this.revertWay === '2')
								this.$util.msg(`请选择收货地址`)
							else {
								this.$util.msg(`请选择取件地址`)
							}
							return;
						}
					}
				}else{
					// 仅退款
					if(this.maxNum === 0){
						this.$util.msg('没有可以申请退款的商品')
						return;
					}
					if(this.num <= 0){
						this.$util.msg('请输入大于0的退款数量')
						return;
					}
				}
				if (!this.msg) {
					this.$util.msg('请填写补充声明')
					return;
				}
				let orderItemList = []
				const subAmount = (Number(this.num)*this.productData.price).toFixed(2)
				const item = {
					orderItemId: this.productData.id, //商品细项id
					num: this.num // 数量 orderSplitDetailId: 1 //拆单表详细id
				}
				if(this.returnType == 4){
					// 仅退款
					item[subAmount] = subAmount
				}
				orderItemList.push(item)
				let params = {}
				// if (this.supplierType==='emall'){
				//   // returnType===1 退货  revertWay===2换货
				// }
				if (!(this.supplierType === 'emall'||this.supplierType === 'eplus')) {
					params = {
						receiveMobile: this.addressData.mobile, //采购人联系电话
						receiveUsername: this.addressData.consigneeName, //采购人收货联系姓名
						type: this.returnType, //服务类型 1 退貨 2 换货
						orderItemList: orderItemList, // 商品详情
						orderId: this.orderData.id, //订单表主键
						revertWay: parseInt(this.revertWay), //返回方式 1 上门取件 2 物流发货
						reason: this.reasonCode, //退换货原因
						receiverArea: this.addressData.areaName, //区域名称
						receiveAreaId: this.addressData.areaId, //区域id
						receiverAddress: this.addressData.addr, //采购人收货地址
						issueDesc: this.msg, //问题描述
						fileIds: [], //附件IDS
						username: this.userInfo.userName, //申请人
						mobile: this.userInfo.mobile, //联系电话
						deptName: this.deptName, //申请部门
						isNeedDetectionReport: 0, //是否需要检测报告 0：不需要 1：需要
						isHasPackage: 1, //是否有包装 0：没有 1有
						packageDesc: 0, //包装描述：0 无包装 10 包装完整 20 包装破损
						isSupplierSplit: this.orderData.isSupplierSplit //是否拆单
					}
				} else {
					params = {
						receiveMobile: this.addressData.mobile, //采购人联系电话
						receiveUsername: this.addressData.consigneeName, //采购人收货联系姓名
						type: this.returnType, //服务类型 1 退貨 2 换货
						orderItemList: orderItemList, // 商品详情
						orderId: this.orderData.id, //订单表主键
						revertWay: parseInt(this.revertWay), //返回方式 1 上门取件 2 物流发货
						reason: this.reasonCode, //退换货原因
						receiverArea: this.addressData.areaName, //区域名称
						receiveAreaId: this.addressData.areaId, //区域id
						receiverAddress: this.addressData.addr, //采购人收货地址
						issueDesc: this.msg, //问题描述
						fileIds: [], //附件IDS
						username: this.userInfo.userName, //申请人
						mobile: this.userInfo.mobile, //联系电话
						deptName: this.deptName, //申请部门
						isNeedDetectionReport: this.isCheck, //是否需要检测报告 0：不需要 1：需要
						isHasPackage: this.isPack, //是否有包装 0：没有 1有
						packageDesc: this.baoway, //包装描述：0 无包装 10 包装完整 20 包装破损
						isSupplierSplit: this.orderData.isSupplierSplit //是否拆单
					}
				}
				if(this.returnType == 4){
					// 仅退款
					params.subAmount = subAmount
					params.goodsStatus = '0'
				}
				console.log(params)
				submitAftersale(params).then(res => {
					console.log('售后信息', res)
					if (res) {
						if (res.code === 0) {
							this.$util.msg('提交成功')
							setTimeout(() => {
								uni.redirectTo({
									url: '/pages/aftersale/list'
								})
							}, 600)
						} else {
							this.$util.msg(res.message)
						}
					}
				})
			},
			stopPrevent() {}
		}
	}
</script>

<style lang="scss">
	@import '@/common/css/uni.css';

	page,
	.container {
		background: #f5f5f5;
	}

	.nav {
		left: 0;
		top: 0;
		background-color: #fff;
		width: 100%;
		position: fixed;
		height: calc(44px + env(safe-area-inset-top));
		padding: 7px 3px;
		padding-top: calc(7px + env(safe-area-inset-top));
		display: flex;
		align-items: center;
		z-index: 1000;

		.back {
			width: 20px;
			height: 20px;
		}

		.title {
			margin: auto;
			font-size: 16px;
			font-weight: 700;
			line-height: 30px;
		}

		.submit {
			font-size: 15px;
			color: #FA436A;
			margin-right: 6rpx;
		}
	}

	.type-area {
		margin: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;
		// padding: 10rpx;

		.title {
			font-weight: bold;
			padding: 20rpx;
			padding-bottom: 10rpx;
			color: #000;
			font-size: 15px;
		}


		.type-item {
			// margin-top: 16rpx;
			display: flex;
			justify-content: space-between;
			padding: 30rpx 20rpx;
			border-bottom: 1rpx solid #e2e2e2;

			&:last-child{
				border-bottom: none;
			}

			.left {
				flex: 1;
				display: flex;
				align-items: center;

				.icon {
					width: 34rpx;
					height: 34rpx;
				}

				text {
					margin-left: 16rpx;
					font-weight: bold;
					color: #000;
					font-size: 15px;
				}
			}

			.right {
				text {
					margin-left: 10rpx;
				}
			}

			&:active {
				background-color: #fafafa;
			}
		}
	}

	.product-area {
		margin: calc(54px + env(safe-area-inset-top)) 20rpx 20rpx 20rpx;
		border-radius: 10rpx;
		background-color: #fff;
		padding: 20rpx;

		.title {
			font-weight: bold;
			color: #000;
			font-size: 15px;
		}

		.product {
			margin-top: 16rpx;
			display: flex;
			align-items: center;

			.left {
				width: 180rpx;
				height: 180rpx;
				margin-right: 20rpx;

				image {
					width: 100%;
					height: 100%;
					border-radius: 10rpx;
				}
			}

			.right {
				height: 180rpx;
				flex: 1;
				display: flex;
				// align-items: center;
				flex-direction: column;
				justify-content: space-between;

				.name {
					width: auto;
					color: #000;
					font-size: 13px;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.bottom {
					width: auto;

					text {
						width: fit-content;
						display: inline-block;
						margin-right: 20rpx;
						color: #000;
						font-size: 13px;
					}
				}
			}
		}
	}

	.exp2 {
		//margin: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;
		padding: 20rpx;

		.title {
			font-weight: bold;
			// padding: 20rpx;
			padding-bottom: 10rpx;
			color: #000;
			font-size: 15px;

			&::after {
				margin-left: 4rpx;
				content: '*';
				color: $base-color;
				font-size: 14px;
			}
		}

		.content {
			margin-top: -10rpx;
			background: #f9f9f9;
			min-height: 140rpx;
			height: 140rpx;
			width: 100%;
			// margin: 20rpx;
			max-height: 200rpx;
			border-radius: 10rpx;
			padding: 20rpx;
			color: #303133;
			font-size: 14px;
			// border: 1px solid #d9d9d9;
		}

		.ph {
			font-size: 13px;
			color: #999;
		}
	}

	.exp {
		margin: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;
		padding: 20rpx;

		.title {
			font-weight: bold;
			// padding: 20rpx;
			padding-bottom: 10rpx;
			color: #000;
			font-size: 15px;

			&::after {
				margin-left: 4rpx;
				content: '*';
				color: $base-color;
				font-size: 14px;
			}
		}

		.content {
			margin-top: 20rpx;
			background: #f9f9f9;
			min-height: 140rpx;
			height: 140rpx;
			width: 100%;
			// margin: 20rpx;
			max-height: 200rpx;
			border-radius: 10rpx;
			padding: 20rpx;
			color: #303133;
			font-size: 14px;
			// border: 1px solid #d9d9d9;
		}

		.ph {
			font-size: 13px;
			color: #999;
		}
	}

	.info-area {
		margin: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;

		.title {
			font-weight: bold;
			padding: 20rpx;
			padding-bottom: 10rpx;
			color: #000;
			font-size: 15px;
		}

		.info-item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 30rpx 20rpx;

			.left {
				color: #000;
				font-size: 14px;

				&::after {
					margin-left: 4rpx;
					content: '*';
					color: $base-color;
					font-size: 14px;
				}
			}

			.right {
				display: flex;
				align-items: center;

				text {
					margin-left: 10rpx;
				}

				.uni-num-box {
					display: flex;
					margin-right: 3px;

					.add,
					.subtract {
						display: flex;
						align-items: center;
						justify-content: center;
						width: 60rpx;
						height: 60rpx;
						color: #333;
						font-size: 38rpx;
						border: 1rpx solid #e5e5e5;
						background-color: #f8f8f8;

						&.disabled {
							color: $font-color-disabled;
						}
					}

					.count {
						display: flex;
						align-items: center;
						width: 100rpx;
						height: 60rpx;
						line-height: 50rpx;
						font-size: 14px;
						text-align: center;
						border-top: 1rpx solid #e5e5e5;
						border-bottom: 1rpx solid #e5e5e5;
						background-color: #fff;
					}
				}
			}

			.i-area {
				background-color: $my-bg-color-grey;
			}
		}
	}

	.method-area {
		margin: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;
	}

	.footer {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		border-top: 1px solid #DCDFE6;

		.confirm {
			background-color: $base-color;
			color: #fff;
			height: 70rpx;
			margin: 30rpx 30rpx;
			line-height: 70rpx;
			border-radius: 20px;
			font-size: 15px;
			text-align: center;
		}
	}

	.mask {
		display: flex;
		align-items: flex-end;
		position: fixed;
		left: 0;
		top: var(--window-top);
		bottom: 0;
		width: 100%;
		background: rgba(0, 0, 0, 0);
		z-index: 9995;
		transition: .3s;

		.mask-content {
			border-radius: 10px 10px 0 0;
			width: 100%;
			min-height: 35vh;
			max-height: 70vh;
			padding: 30upx;
			background: #fff;
			transform: translateY(100%);
			transition: .3s;
			overflow-y: scroll;
		}

		.header {
			margin-bottom: 30upx;
			height: 60rpx;

			.title {
				color: #000;
				display: inline-block;
				font-weight: bold;
				font-size: 17px;
			}

			.close {
				display: inline-block;
				float: right;
				width: 36rpx;
				height: 36rpx;
				margin-top: 12rpx;
			}
		}

		.integral-area {
			white-space: nowrap;
			// flex-flow: row wrap;
			// align-items: flex-start;
			// justify-content: flex-start;
			// justify-content: space-between;
			// width: 100%;
			margin-top: 30rpx;

			.scroll-wrapper {
				display: flex;
				flex-direction: row;

				.integral-item {
					// width: 30%;
					// height: 30%;
					min-width: 100px;
					min-height: 100rpx;
					color: #000;
					padding: 16rpx;
					text-align: center;
					background-color: #f3f3f3;
					border-radius: 6px;
					margin-right: 30rpx;
					margin-bottom: 20rpx;
					font-size: 12px;

					.name {
						display: block;
						font-size: 12px;
					}

					.balance {
						margin-top: 8rpx;
						display: block;
						font-size: 10px;
					}

					&.active {
						background-color: #fff1ef;
						border: 1px solid $base-color;
						color: $base-color;
					}
				}
			}
		}

		&.none {
			display: none;
		}

		&.show {
			background: rgba(0, 0, 0, .4);

			.mask-content {
				transform: translateY(0);
			}
		}
	}

	.soild {
		// position: absolute;
		// z-index: 3;
		// left: 0;
		// right: 0;
		// height: 0;
		// content: '';
		// transform: scaleY(.5);
		border-bottom: 1px solid #E4E7ED;
		// border-right: 50rpx;
		// border-left: 50rpx;
		//border-width: 200 200 220 200;
	}

	.cgr-info {
		display: flex;
		justify-content: space-between;
		align-items: center;
		//display: flex;
		flex-direction: row;
		// margin:0 auto;
		z-index: 999;
		background: #EEEEEE;
		//padding: 20rpx 30rpx;
		//width: 100%;
		//min-height: 150rpx;
		line-height: 55rpx;
		margin: 16rpx 0;
		margin-left: 8rpx;
		//border-top: 1px solid $my-border-color-grey;
		//border-bottom: 1px solid $my-border-color-grey;
		background-color: $my-bg-color;
		border-radius: 15rpx;

		.tel {
			margin-left: 30rpx;
		}

		.address {
			line-height: 18px;
			color: $my-text-color-grey;
		}

		.lefts {
			//padding: 5rpx ;
			flex: 0.2;
			margin-top: -10px;
			//margin-left: 20px;
			//float: right;
			//margin: auto;
		}

		.right {
			display: flex;
			align-items: center;

			text {
				margin-left: 20rpx;
			}

			.uni-num-box {
				display: flex;
				margin-right: 3px;

				.add,
				.subtract {
					display: flex;
					align-items: center;
					justify-content: center;
					width: 60rpx;
					height: 60rpx;
					color: #333;
					font-size: 38rpx;
					border: 1rpx solid #e5e5e5;
					background-color: #f8f8f8;

					&.disabled {
						color: $font-color-disabled;
					}
				}

				.count {
					display: flex;
					align-items: center;
					width: 100rpx;
					height: 60rpx;
					line-height: 50rpx;
					font-size: 14px;
					text-align: center;
					border-top: 1rpx solid #e5e5e5;
					border-bottom: 1rpx solid #e5e5e5;
					background-color: #fff;
				}
			}
		}
	}

	.yticon {
		font-size: 44upx;
		//color: #5eba8f;
		margin-right: 16upx;
		line-height: 40upx;
	}

	.action-button {
		isplay: flex;
		align-items: center;
		//width: 690upx;
		height: 80upx;
		margin: 20rpx;
		padding: 20rpx;
		color: #FFFFFF;
		//box-shadow: 0 0 20upx 0 rgba(0, 0, 0, .5);
		border-radius: 16upx;
	}

	/* 底部栏 */
	.action-section {
		/* #ifdef H5 */
		margin-bottom: 0upx;
		/* #endif */
		position: fixed;
		left: 30upx;
		bottom: 30upx;
		z-index: 95;
		display: flex;
		align-items: center;
		width: 690upx;
		height: 100upx;
		padding: 0 30upx;
		color: #FFFFFF;
		background: #1ea143;
		//box-shadow: 0 0 20upx 0 rgba(0, 0, 0, .5);
		border-radius: 16upx;

		.checkbox {
			height: 52upx;
			position: relative;

			image {
				width: 52upx;
				height: 100%;
				position: relative;
				z-index: 5;
			}
		}

		.clear-btn {
			position: absolute;
			left: 26upx;
			top: 0;
			z-index: 4;
			width: 0;
			height: 52upx;
			line-height: 52upx;
			padding-left: 38upx;
			font-size: $font-base;
			color: #fff;
			background: $font-color-disabled;
			border-radius: 0 50px 50px 0;
			opacity: 0;
			transition: .2s;

			&.show {
				opacity: 1;
				width: 120upx;
			}
		}

		.total-box {
			flex: 1;
			display: flex;
			flex-direction: column;
			text-align: right;
			padding-right: 40upx;

			.price {
				font-size: $font-base + 4upx;
				color: $uni-color-primary;
			}

			.coupon {
				font-size: $font-sm;
				color: $font-color-light;

				text {
					color: $uni-color-primary;
				}
			}
		}

		.confirm-btn {
			padding: 0 38upx;
			margin: 0;
			border-radius: 100px;
			height: 76upx;
			line-height: 76upx;
			font-size: $font-base + 2upx;
			background: $uni-color-primary;
			box-shadow: 1px 2px 5px rgba(217, 60, 93, 0.72)
		}
	}
</style>

<style lang="scss" scoped>
	.active>text {
		background: #fbecee;
		border-radius: 20px;
		color: #55aaff;
		font-size: 28rpx;
		// padding: 10rpx 28rpx;
		/* margin: 10rpx 10rpx 10rpx 0; */
		display: inline-block;
	}

	.active>view {
		/* background: #fbecee; */
		/* border-radius: 20px; */
		color: $my-text-color-active;
		font-size: 28rpx;
		// padding: 10rpx 28rpx;
		/* margin: 10rpx 10rpx 10rpx 0; */
		display: inline-block;
	}

	.s-list {
		display: flex;
		align-items: center;
		padding: 20upx 30upx;
		background: #fff;
		position: relative;

	}

	/* 地址 */
	.wrapper {
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.address-box {
		display: flex;
		align-items: center;

		.tag {
			font-size: 24upx;
			width: fit-content;
			text-align: center;
			color: $base-color;
			margin-right: 10upx;
			background: #FFFFFF;
			border: 1px solid #ffb4c7;
			border-radius: 4upx;
			padding: 4upx 10upx;
			line-height: 1;
		}


		.address {
			font-size: 30upx;
			/* color: $font-color-dark; */
		}
	}
</style>
<style lang="scss" scoped>
	.popup {
		height: fit-content;
		width: 100%;
		background: #fff;
	}

	.picker-btn {
		display: flex;
		height: 100upx;
		width: 100%;
		line-height: 100upx;
		background: #fff;
		font-size: 34upx;
		z-index: 1;
		border-bottom: 1rpx solid #ccc;

		.lefts {
			flex: 1;
			color: #0076FF;
			padding-left: 40upx;
			box-sizing: border-box;
		}

		.rights {
			flex: 1;
			text-align: right;
			padding-right: 40upx;
			color: #FE4533;
			box-sizing: border-box;
		}
	}

	picker-view {
		width: 100%;
		height: 500rpx;
		display: relative;
	}

	.item {
		line-height: 100rpx;
		text-align: center;
	}
</style>
